<%--
  Created by IntelliJ IDEA.
  User: zhangjie
  Date: 2019/4/25
  Time: 1:16 PM
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/jsp/component/common.jsp" %>
<%@ include file="/WEB-INF/jsp/component/commonBottom.jsp" %>
<html>
<head>
    <title>修改血脂信息页面</title>
    <script src="../assets/js/views/vue.min.js"></script>
    <script type="text/javascript" src="../assets/js/echarts.js"></script>
    <link rel="stylesheet" href="${frames}/css/lib/bootstrap.min.css" type="text/css" type="text/css">
    <link rel="stylesheet" href="${frames}/css/paginate.css" type="text/css">
    <script src="${js}/jquery-1.9.1.min.js"></script>
    <%--<link rel="stylesheet" href="${frames}/css/table.css" type="text/css">--%>
    <link rel="stylesheet" href="${frames}/css/qulitity.css" type="text/css" type="text/css">
    <%--<link rel="stylesheet" href="../assets/css/views/modules/_common.scss">--%>
    <link rel="stylesheet" href="${assets}/css/views/department/departmentMgr.css">
    <script src="${frames}/Chronic/laydate/laydate.js"></script>
    <script src="${js}/jquery.dataTables.js"></script>
    <style>
        * {
            padding: 0;
            list-style: none;
            text-decoration: none;
            font-weight: 100;
            height: auto;
        }

        h1 {
            margin-top: 0 !important;
            font-size: 20px !important;
        }

        a {
            text-decoration: none
        }

        .page_nav li {
            list-style: none !important;
        }

        .page_nav li span {
            margin: 0 !important;
        }

        body {
            height: auto;
        }

        #main span {
            font-size: 15px;
            line-height: 33px;
            display: inline-block;
        }

        b {
            font-family: MicrosoftYaHei-Bold;
            font-size: 14px;
            font-weight: normal;
            font-stretch: normal;
            letter-spacing: 0px;
            color: #333333;
            line-height: 24px;
            font-weight: 600;
        }

        h4 {
            font: 22px/34px '微软雅黑';
            color: black;
        }

        h3 {
            font-family: MicrosoftYaHei;
            font-size: 20px;
            font-weight: normal;
            font-stretch: normal;
            letter-spacing: 0px;
            color: #2a3137;
            margin: 0;
            padding: 0;
            line-height: 30px;
        }

        /*  第一部分 用户信息 */
        .first_news {
            width: 100%;
            overflow: hidden;
        }

        .first_news h3 {
            display: inline-block;
        }

        .img {
            width: 12%;
        }

        .lives label {
            margin: 0 15px;
        }

        .content {
            display: flex;
        }

        .infor {
            width: 80%;
            margin-left: 2%;
        }

        .infor div span {
            color: #666666;
        }

        .color {
            margin: 0 !important;
        }

        /* 第二部分 最后检验 信息 */
        .illness h3 {
            display: inline-block;
        }

        .illness a {
            width: 8%;
            background-color: #35acfd;
            color: white;
            text-align: center;
            display: inline-block;
            line-height: 150%;
            border-radius: 10px;
        }

        .feritin {
            margin: 15px 0 15px 10px;
        }

        .feritin label {
            font: 15px/44px 微软雅黑;
            color: #666666;
        }

        .feritin div:nth-child(1) .types {
            width: 10%;
        }

        .feritin div:nth-child(1) .types label {
            margin-left: 20px;
        }

        .feritin div:nth-child(2) .ill {
            width: 15%;
        }

        .feritin div:nth-child(2) .ill label {
            margin-left: 15%;
        }

        .feritin div:nth-child(3) .live {
            width: 25%;
            vertical-align: middle;
        }

        .feritin div:nth-child(3) .live input {
            margin-left: 10%;
        }

        .feritin div:nth-child(3) .live label {
            margin-left: 3%;
            margin-right: 3%;
            vertical-align: middle;
        }

        .feritin div:nth-child(3) .live label {
            margin: 0 3%;
            vertical-align: middle;
        }

        .text {
            width: 100%;
        }

        .title {
            line-height: 30px;
            margin-bottom: 5px;
            font-size: 16px;
            color: #666666;
            margin-left: 10px;
        }

        .title1 {
            line-height: 25px;
            margin-left: 10px;
            margin-top: 5px;
            font-family: MicrosoftYaHei;
            font-size: 16px;
            font-weight: normal;
            font-stretch: normal;
            letter-spacing: 0px;
            color: #666666;
        }

        .text_content {
            margin: 20px 0;
            margin-left: 14px;
        }

        .text_content div {
            width: 40%;
            text-align: left;
            display: inline-block;
        }

        .text_number {
            color: #666666;
            margin-left: 10px;
        }

        .text_number span {

        }

        .table tr {
            height: 42px;
        }

        /*thead hr{*/
        /*border-top: none !important;*/
        /*border-bottom: none !important;*/
        /*}*/
        .dataTable {
            text-align: center;
        }

        .btn {
            float: right;
            width: 100px;
            font-size: 16px;
            line-height: 28px;
            background: #35acfd !important;
            margin-right: 15px !important;
            padding: 0 !important;
        }

        .feritin input {
            width: 20px;
            height: 20px;
            background: white;
            vertical-align: middle;
            margin-bottom: 7px;
        }

        input[type=checkbox] {
            width: 20px;
            height: 20px;
            -webkit-appearance: none;
            border-radius: 5px;
            border: 1px solid #9e9e9e;
        }

        input[type=checkbox]:checked {
            background-image: url('../assets/images/radio.png');
            background-size: 100% 100%;
            border: none
        }

        input[type=radio] {
            -webkit-appearance: none;
            border-radius: 50%;
            background-image: url('../assets/images/nocheck.png');
            background-size: 100% 100%
        }

        input[type=radio]:checked {
            background-image: url('../assets/images/checkout.png');
            background-size: 100% 100%
        }

        .sign_content {
            margin-left: 15px;
            margin-bottom: 20px;
        }

        .sign_content label {
            line-height: 30px;
        }

        .sign_content div input {
            width: 110px;
            line-height: 30px;
            border: solid 1px #d0d0d0;
            text-indent: 10px;
            height: 30px;
            display: inline-block;
            vertical-align: middle;
            position: absolute;
        }

        .sign_content div span {
            position: absolute;
        }

        .sign_content div {
            display: inline-block;
            width: 170px;
            margin-right: 20px;
            position: relative;
            height: 36px;
        }

        .checked {
            background-image: url('../assets/images/checkout.png') !important;
            background-size: 100% 100%
        }

        .ill1 {
            width: auto;
            margin-right: 15px;
            display: inline-block;
        }

        .ill1 label {
            margin: 0 15px;
        }

        #tablepart p {
            width: 100%;
            text-align: center;
            font-size: 15px;
            line-height: 40px;
            color: #333333;
        }

        #table p {
            width: 100%;
            text-align: center;
            font-size: 15px;
            line-height: 40px;
            color: #333333;
        }

        .test p {
            width: 100%;
            line-height: 100px;
            font-size: 15px;
            text-align: center;
        }

        img {
            max-width: 100%;
            height: auto;
        }

        .img {
            width: 130px;
        }

        /* first_news */
        #tablepart #example tbody tr {
            cursor: pointer;
        }

        .dataTables_empty {
            width: 100% !important;
            text-align: center;
            font-size: 15px !important;
            line-height: 40px !important;
            color: #333333 !important;
        }

        thead tr th {
            font-family: MicrosoftYaHei;
            font-size: 16px;
            font-weight: normal;
            font-stretch: normal;
            line-height: 40px;
            letter-spacing: 0px;
            color: #999999;
        }

        td {
            font-family: MicrosoftYaHei;
            font-size: 16px;
            font-weight: normal;
            font-stretch: normal;
            line-height: 40px;
            letter-spacing: 0px;
            color: #333333;
            border-bottom: 1px solid #e6e6e6;
        }

        .other span {
            width: 40.7%;
            margin-right: 5%;
        }

        .chank {
            width: 20%;
            overflow: hidden;
            margin-right: 2%;
            vertical-align: middle;
            height: 60px;
        }

        .chank:nth-child(1) label {
            width: 70%;
        }

        .chank:nth-child(2) label {
            width: 80%;
            position: absolute;
            top: 5px;
        }

        .chank:nth-child(2) {
            width: 30%;
            position: relative;
        }

        .chank:nth-child(3) {
            width: 40%;
        }

        .chank:nth-child(5) label {
            width: 80%;
            position: absolute;
            top: 5px;
        }

        .firstShow input, select {
            width: 150px;
            height: 30px;
            line-height: 30px;
            text-indent: 20px;
            border: 1px solid #d0d0d0;
            margin-left: 15px;
        }

        .chank:nth-child(5) {
            width: 30%;
            position: relative;
        }

        .chank:nth-child(6) label {
            width: 80%;
            position: absolute;
            top: 5px;
            margin-left: 4%;
        }

        .chank:nth-child(6) {
            width: 35%;
            position: relative;
        }

        .chank:nth-child(4) label {
            width: 70%;
            position: absolute;
            top: 5px;
            margin-left: 4%;
        }

        .chank:nth-child(4) {
            position: relative;
        }

        .chank label {
            margin-left: 2%;
            word-wrap: break-word;
            vertical-align: middle;
            line-height: 120%;
        }

        #testtable tr th {
            width: 24%;
        }

        #testtable tr th:nth-child(1) {
            width: 4%;
        }

        /*.text_content div .title{*/
        /*display:block !important;*/
        /*line-height:20px !important;*/
        /*text-indent:10px;*/
        /*width:300px;*/
        /*padding:30px;*/
        /*backrgound:white;*/
        /*border:1px solid black;*/
        /*border-radius:10px;*/
        /*position:relative;*/
        /*top:10px;*/
        /*height:120px;*/
        /*vertical-align:center;*/
        /*}*/
        /*.text_number{*/
        /*position:absolute;*/
        /*}*/
        .text_content div span {
            font-weight: normal;
        }

        #example4_wrapper .dataTables_paginate {
            display: none;
        }

        .title_xz {
            width: 100px;
            display: inline-block;
        }

        .othernews label {
            display: inline-block;
            width: 90px;
        }

        .othernews input {
            vertical: middle;
            width: 60%;
            height: 30px;
            line-height: 30px;
            text-indent: 20px;
            border: 1px solid #d0d0d0;
        }

        .warn {
            width: 95% !important;
            background: #e6e6e6;
        }

        /*.fade{*/
        /*cursor:pointer;*/
        /*display:inline-block;*/
        /*}*/
        .illnessTitle {
            width: 23%;
            text-align: center;
            display: inline-block;
        }

        .continerContent {
            width: 100%;
            height: 500px;
            overflow-y: auto;
            overflow-x: visible;
        }

        .submitBtn {
            width: 250px;
            margin: 0 auto;
        }

        .submitBtn button {
            color: white !important;
            width: 100px;
            font-size: 14px !important;
            line-height: 30px;
            background: #35acfd;
            color: white;
            margin-top: 15px;
        }

        #liveMsg {
            width: 50%;
            height: 30px;
            line-height: 30px;
            text-indent: 20px;
            border: 1px solid #d0d0d0;
            margin-left: 0px;
        }
    </style>
</head>
<body>
<div class="header">
    <h1>高血脂信息修改</h1>
</div>
<div id="main">
    <div class="continerContent" style="width:99%;">
        <div class="illness" style="background-color: #ffffff;box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.05);">
            <div style="margin-left:19px;">
                <div class="test">
                    <div class="test">
                        <div class="feritin" style="margin-bottom:0px;">
                            <div class="way_content">
                                <div class="firstShow">
                                    <span class="title1" style="color: rgb(169, 169, 169);">高血脂分层/分级：</span>
                                    <%-- 随访方式 下拉 --%>
                                    <input type="text" v-model="bfData.bfGrade">
                                    <span class="title1" style="color: rgb(169, 169, 169);">确诊时间</span>
                                    <%-- 日期选择器 --%>
                                    <div class="input-group date form_date" data-date-format="yyyy-mm-dd"
                                         style="display:inline-block !important">
                                        <input type="text" class="lay-date" id="beginTime"
                                               v-model="bfData.diagnosisTime">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="feritin fadeContainer" style="margin-top:0px;">
                            <div style="width:100%;overflow:hidden;">
                                <span class="title1 title_xz" style="color:#a9a9a9;">主要症状</span>
                                <div style="display:inline-block;vertical-align: top;width:75%;" id="symptom"
                                     ref="symptom">
                                        <span class="ill1">
                                            <input type="checkbox" name="symptom" value="1" id="xz1" />
                                            <label for="xz1">头晕头痛</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="symptom" value="2" id="xz2" />
                                            <label for="xz2">失眠健忘</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="symptom" value="3" id="xz3" />
                                            <label for="xz3">肢体麻木</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="symptom" value="4" id="xz4" />
                                            <label for="xz4">胸闷，胸痛，心悸</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="symptom" value="5" id="xz5" />
                                            <label for="xz5">心慌，气短</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="symptom" value="6" id="xz6" />
                                            <label for="xz6">神疲乏力</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="symptom" value="7" id="xz7" />
                                            <label for="xz7">嘴角歪斜，不能说话</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="symptom" value="8" id="xz8" />
                                            <label for="xz8">心绞痛</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="symptom" value="9" id="xz8" />
                                            <label for="xz8">无</label>
                                        </span>
                                </div>
                            </div>

                            <div style="width:100%;overflow:hidden;">
                                <span class="title1 title_xz" style="color:#a9a9a9;">家族史</span>
                                <div style="display:inline-block;vertical-align: top;width:75%;" id="familyHistory"
                                     ref="familyHistory">
                                        <span class="ill1">
                                            <input type="checkbox" name="familyHistory" value="1" id="xzkz1" />
                                            <label for="xzjz1">高血脂</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="familyHistory" value="2" id="xzjz2" />
                                            <label for="xzjz2">冠心病</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="familyHistory" value="3" id="xzjz3" />
                                            <label for="xzjz3">脑卒中</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="familyHistory" value="4" id="xzjz4" />
                                            <label for="xzjz4">糖尿病</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="familyHistory" value="5" id="xzjz5" />
                                            <label for="xzjz5">以上都无</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="familyHistory" value="6" id="xzjz6" />
                                            <label for="xzjz6">不详</label>
                                        </span>
                                    <div class="othernews">
                                        <label>其他</label>
                                        <input type="text" v-model="bfData.otherSymptom">
                                    </div>
                                </div>
                            </div>

                            <div style="width:100%;overflow:hidden;">
                                <span class="title1 title_xz" style="color:#a9a9a9;">并发症发生情况</span>
                                <div style="display:inline-block;vertical-align: top;width:75%;" id="complication"
                                     ref="complication">
                                        <span class="ill1">
                                            <input type="checkbox" name="complication" value="1" id="bfzzk1" />
                                            <label for="bfzzk1">脑卒中</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="complication" value="2" id="bfzzk2" />
                                            <label for="bfzzk2">心肌梗死</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="complication" value="3" id="bfzzk3" />
                                            <label for="bfzzk3">心绞痛</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="complication" value="4" id="bfzzk4" />
                                            <label for="bfzzk4">间接性跛行（肢体活动后疼痛）</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="complication" value="5" id="bfzzk7" />
                                            <label for="bfzzk7">角膜弓</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="complication" value="6" id="bfzzk5" />
                                            <label for="bfzzk5">脂血症眼底改变</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" name="complication" value="7" id="bfzzk6" />
                                            <label for="bfzzk6">无</label>
                                        </span>
                                    <div class="othernews">
                                        <label>其他</label>
                                        <input type="text" v-model="bfData.otherComplication">
                                    </div>
                                    <div>
                                        <span class="title1" style="margin-right:55px;margin-left:0px;">生活自理能力</span>
                                        <div style="display:inline-block" id="selfCare" ref="selfCare">
                                                <span class="lives">
                                                    <input type="radio" value="1" name="class" id="live1"
                                                           name="selfCare">
                                                    <label for="live1">完全自理</label>
                                                </span>
                                            <span class="lives">
                                                    <input type="radio" value="2" name="class" id="live2"
                                                           name="selfCare">
                                                    <label for="live2">部分自理</label>
                                                </span>
                                            <span class="lives">
                                                    <input type="radio" value="3" name="class" id="live3"
                                                           name="selfCare">
                                                    <label for="live3">完全不能自理</label>
                                                </span>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div style="width:100%;overflow:hidden;">
                                <span class="title1 title_xz" style="color:#a9a9a9;">并发症情况</span>
                                <div style="display:inline-block;vertical-align: top;width:75%;"
                                     id="complicationSituation" ref="complicationSituation">
                                        <span class="ill1">
                                            <input type="checkbox" value="1" name="complicationSituation" id="bfzqk1" />
                                            <label for="bfzqk1">冠心病</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" value="2" name="complicationSituation" id="bfzqk2" />
                                            <label for="bfzqk2">脑卒中</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" value="3" name="complicationSituation" id="bfzqk3" />
                                            <label for="bfzqk3">糖尿病</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" value="4" name="complicationSituation" id="bfzqk4" />
                                            <label for="bfzqk4">高血压</label>
                                        </span>
                                    <span class="ill1">
                                            <input type="checkbox" value="5" name="complicationSituation" id="bfzqk5" />
                                            <label for="bfzqk5">以上都无</label>
                                        </span>
                                </div>
                            </div>

                            <div style="width:100%;overflow:hidden;">
                                <p class="title1 title_xz" style="color:#a9a9a9;text-align:left;line-height:40px;">
                                    用药情况(药名，剂量，用法)</p>
                                <textarea name="" id="" cols="30" rows="10"
                                          style="height:120px;border:1px solid #d0d0d0;width:70%;margin-left:10px;text-indent:10px;"
                                          v-model="bfData.medicalMsg"></textarea>
                            </div>

                            <div style="width:100%;overflow:hidden;">
                                <p class="title1 title_xz"
                                   style="color:#a9a9a9;text-align:left;line-height:40px;margin-bottom:0px;">因素及控制情况</p>
                                <div style="margin-left:90px;">
                                    <span class="title1" style="margin-right:25px;margin-left:0px;">高脂饮食</span>
                                    <div style="display:inline-block" id="food" ref="food">
                                            <span class="lives">
                                                <input type="radio" value="1" name="food" id="gzys1">
                                                <label for="gzys1">经常</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="2" name="food" id="gzys2">
                                                <label for="gzys2">偶尔</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="3" name="food" id="gzys3">
                                                <label for="gzys3">从不</label>
                                            </span>
                                    </div>
                                </div>
                                <div style="margin-left:90px;">
                                    <span class="title1" style="margin-right:25px;margin-left:0px;">吸烟情况</span>
                                    <div style="display:inline-block" id="smoke" ref="smoke">
                                            <span class="lives">
                                                <input type="radio" value="1" name="smoke" id="smoke1">
                                                <label for="smoke1">吸烟</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="2" name="smoke" id="smoke2">
                                                <label for="smoke2">戒烟</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="3" name="smoke" id="smoke3">
                                                <label for="smoke3">不吸</label>
                                            </span>
                                    </div>
                                </div>
                                <div style="margin-left:90px;">
                                    <span class="title1" style="margin-right:25px;margin-left:0px;">饮酒情况</span>
                                    <div style="display:inline-block" id="drink" ref="drink">
                                            <span class="lives">
                                                <input type="radio" value="1" name="drink" id="yjqk1">
                                                <label for="yjqk1">经常</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="2" name="drink" id="yjqk2">
                                                <label for="yjqk2">偶尔</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="3" name="drink" id="yjqk3">
                                                <label for="yjqk3">不饮</label>
                                            </span>
                                    </div>
                                </div>
                                <div style="margin-left:90px;">
                                    <span class="title1" style="margin-right:25px;margin-left:0px;">体育锻炼</span>
                                    <div style="display:inline-block" id="sports" ref="sports">
                                            <span class="lives">
                                                <input type="radio" value="1" name="sports" id="tydl1">
                                                <label for="tydl1">规律</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="2" name="sports" id="tydl2">
                                                <label for="tydl2">偶尔</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="3" name="sports" id="tydl3">
                                                <label for="tydl3">不锻炼</label>
                                            </span>
                                    </div>
                                </div>
                            </div>

                            <div style="width:100%;overflow:hidden;">
                                <p class="title1 title_xz" style="color:#a9a9a9;text-align:left;line-height:40px;">
                                    最后一次检查结果</p>
                                <div style="margin-left:90px;">
                                    <div class="sign_content third">
                                        <div>
                                            <label for="">身高：</label>
                                            <input type="text" class="height form-control" v-model="bfData.height">
                                            <span style="left:125px;">cm</span>
                                        </div>
                                        <div>
                                            <label for="">体重：</label>
                                            <input type="text" class="weightGuide form-control weight"
                                                   v-model="bfData.weight">
                                            <span style="left:125px;">kg</span>
                                        </div>
                                        <div>
                                            <label for="">体脂指数：</label>
                                            <input type="text" class="bmi form-control" v-model="bfData.bmi">
                                            <span style="left:140px;">kg/m²</span>
                                        </div>
                                    </div>
                                    <div class="sign_content third">
                                        <div>
                                            <label for="">腰围：</label>
                                            <input type="text" class="waistline form-control"
                                                   v-model="bfData.waistline">
                                            <span style="left:125px;">cm</span>
                                        </div>
                                        <div>
                                            <label for="">心率：</label>
                                            <input type="text" class="pul form-control" v-model="bfData.pul">
                                            <span style="left:110px;">次/分</span>
                                        </div>
                                        <div>
                                            <label for="">空腹血糖：</label>
                                            <input type="text" class="bloodSugar form-control"
                                                   v-model="bfData.bloodSugar">
                                            <span style="left:130px;">mmol/L</span>
                                        </div>
                                    </div>
                                    <div class="sign_content third">
                                        <div>
                                            <label for="">收缩压：</label>
                                            <input type="text" class="lowPressure form-control"
                                                   v-model="bfData.lowPressure">
                                            <span style="left:120px;">mmHg</span>
                                        </div>
                                        <div>
                                            <label for="">舒张压：</label>
                                            <input type="text" class="highPressure form-control"
                                                   v-model="bfData.highPressure">
                                            <span style="left:120px;">mmHg</span>
                                        </div>
                                    </div>
                                    <div class="sign_content third">
                                        <div>
                                            <label for="">甘油三酯：</label>
                                            <input type="text" class="triglyceride form-control"
                                                   v-model="bfData.triglyceride">
                                            <span style="left:130px;">mmol/L</span>
                                        </div>
                                        <div>
                                            <label for="">总胆固醇：</label>
                                            <input type="text" class="cholesterol form-control"
                                                   v-model="bfData.cholesterol">
                                            <span style="left:130px;">mmol/L</span>
                                        </div>
                                        <div>
                                            <label for="">低密度胆固醇：</label>
                                            <input type="text" class="lowCholesterol form-control"
                                                   v-model="bfData.lowCholesterol">
                                            <span style="left:160px;">mmol/L</span>
                                        </div>
                                    </div>
                                    <div class="sign_content third">
                                        <div style="width:200px;">
                                            <label for="">高密度胆固醇：</label>
                                            <input type="text" class="highCholesterol form-control"
                                                   v-model="bfData.highCholesterol">
                                            <span style="left:160px;">mmol/L</span>
                                        </div>
                                        <div>
                                            <label for="">测血脂值：</label>
                                            <input type="text" class="bloodFat form-control" v-model="bfData.bloodFat">
                                            <span style="left:130px;">mmol/L</span>
                                        </div>
                                    </div>
                                    <div class="othernews">
                                        <label style="margin-left:15px;">其他</label>
                                        <input type="text" v-model="bfData.otherIll">
                                    </div>
                                </div>

                            </div>

                            <div style="width:100%;overflow:hidden;">
                                <p class="title1 title_xz" style="color:#a9a9a9;text-align:left;line-height:40px;">
                                    诊断时检测情况</p>
                                <div style="margin-left:90px;">
                                    <div class="sign_content third">
                                        <div>
                                            <label for="">甘油三酯：</label>
                                            <input type="text" class="triglyceride form-control"
                                                   v-model="bfData.diagTriglyceride">
                                            <span style="left:130px;">mmol/L</span>
                                        </div>
                                        <div>
                                            <label for="">总胆固醇：</label>
                                            <input type="text" class="cholesterol form-control"
                                                   v-model="bfData.diagCholesterol">
                                            <span style="left:130px;">mmol/L</span>
                                        </div>
                                        <div>
                                            <label for="">低密度胆固醇：</label>
                                            <input type="text" class="lowCholesterol form-control"
                                                   v-model="bfData.diagLowCholesterol">
                                            <span style="left:160px;">mmol/L</span>
                                        </div>
                                    </div>
                                    <div class="sign_content third">
                                        <div style="width:200px;">
                                            <label for="">高密度胆固醇：</label>
                                            <input type="text" class="highCholesterol form-control"
                                                   v-model="bfData.diagHighCholesterol">
                                            <span style="left:160px;">mmol/L</span>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div style="width:100%;overflow:hidden;">
                                <p class="title1 title_xz" style="color:#a9a9a9;text-align:left;line-height:40px;">
                                    高血脂膳食评价表</p>
                                <div style="margin-left:90px;">
                                    <span class="title1"
                                          style="margin-right:25px;margin-left:0px;">您近一周吃肉是否<75g/d?</span>
                                    <div style="display:inline-block" id="meat" ref="meat">
                                            <span class="lives">
                                                <input type="radio" value="0" name="meat" id="isMeat1">
                                                <label for="isMeat1">否=0</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="1" name="meat" id="isMeat2">
                                                <label for="isMeat2">是=1</label>
                                            </span>
                                    </div>
                                </div>
                                <div style="margin-left:90px;">
                                    <span class="title1" style="margin-right:25px;margin-left:0px;">您吃的肉是什么种类</span>
                                    <div style="display:inline-block" ref="meatType" id="meatType">
                                            <span class="lives">
                                                <input type="radio" value="0" name="meatType" id="whatMeat1">
                                                <label for="whatMeat1">瘦肉=0</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="1" name="meatType" id="whatMeat2">
                                                <label for="whatMeat2">肥瘦肉=1</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="2" name="meatType" id="whatMeat3">
                                                <label for="whatMeat3">肥肉=2</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="3" name="meatType" id="whatMeat4">
                                                <label for="whatMeat4">内脏=3</label>
                                            </span>
                                    </div>
                                </div>
                                <div style="margin-left:90px;">
                                    <span class="title1" style="margin-right:25px;margin-left:0px;">您近一周吃蛋数量是多少个？</span>
                                    <div style="display:inline-block" ref="eggs" id="eggs">
                                            <span class="lives">
                                                <input type="radio" value="1" name="eggs" id="egg1">
                                                <label for="egg1">0-3个/周=1</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="2" name="eggs" id="egg2">
                                                <label for="egg2">2-4个/周=2</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="3" name="eggs" id="egg3">
                                                <label for="egg3">7个以上/周=3</label>
                                            </span>
                                    </div>
                                </div>
                                <div style="margin-left:90px;">
                                    <span class="title1" style="margin-right:25px;margin-left:0px;">您近一周吃煎炸食品数量（油饼、油条、炸糕等）</span>
                                    <div style="display:inline-block" ref="fried" id="fried">
                                            <span class="lives">
                                                <input type="radio" value="0" name="fried" id="muchFood1">
                                                <label for="muchFood1">未吃=0</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="1" name="fried" id="muchFood2">
                                                <label for="muchFood2">1-4次/周=1</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="2" name="fried" id="muchFood3">
                                                <label for="muchFood3">5-7次/周=2</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="3" name="fried" id="muchFood4">
                                                <label for="muchFood4">7次以上/周=3</label>
                                            </span>
                                    </div>
                                </div>

                                <div style="margin-left:90px;">
                                    <span class="title1" style="margin-right:25px;margin-left:0px;">您近一周吃奶油糕点的次数</span>
                                    <div style="display:inline-block" ref="cream" id="cream">
                                            <span class="lives">
                                                <input type="radio" value="0" name="cream" id="milk1">
                                                <label for="milk1">未吃=0</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="1" name="cream" id="milk2">
                                                <label for="milk2">1-4次/周=1</label>
                                            </span>
                                        <span class="lives">
                                                <input type="radio" value="2" name="cream" id="milk3">
                                                <label for="milk3">5-7次/周=2</label>
                                            </span>
                                    </div>
                                    <%--<div class="othernews">--%>
                                    <%--<label>评分总和</label>--%>
                                    <%--<input type="text" style="width:180px;" v-model="total" disabled="disabled">--%>
                                    <%--</div>--%>
                                </div>
                            </div>
                            <div class="sign_content">
                                <div class="warn" style="width:100%;">
                                    <b style="float:left;margin-right:2%;margin:25px 30px;">
                                        <img src="../assets/images/warn.png" alt="">
                                    </b>
                                    <p style="height:80px;width:90%;text-align:left;margin-top:20px;line-height:30px;">
                                        按实际情况在框里填数，总分<3为合格，总分3～5为轻度膳食不良，总分>6为严重膳食不良</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="form-group submitBtn" style="text-align: center ">
        <button type="submit" class="btn-active btn" id="keep" @click="keep()" style="margin-left:20px;">保存</button>
        <button type="button" class="btn-active btn" data-dismiss="modal" id="closeModalButt" onclick="closeFrame()">
            关闭
        </button>
    </div>
</div>
<script>
    var vm = new Vue({
        el: '#main',
        data: {
            idCard: '',
            bfData: {
                bfGrade: '',
                diagnosisTime: '',
                otherSymptom: '',
                medicalMsg: '',
                height: '',
                weight: '',
                bmi: '',
                waistline: '',
                pul: '',
                bloodSugar: '',
                highPressure: '',
                lowPressure: '',
                triglyceride: '',
                cholesterol: '',
                highCholesterol: '',
                lowCholesterol: '',
                otherIll: '',
                bloodFat: '',
                proposal: '',
                total: ''
            },
            // 首页地址
            refreshto: ''
        },
        computed: {
            'total': function () {
                let totalNumber = '';
                let that = this;
                totalNumber = parseInt(that.bfData.meat) + parseInt(that.bfData.cream) + parseInt(that.bfData.fried) + parseInt(that.bfData.eggs) + parseInt(that.bfData.meatType);
                if (isNaN(parseInt(totalNumber))) {
                    totalNumber = 0
                }
                return totalNumber
            }
        },
        mounted() {
            let that = this;
            var idCard = location.search.split('?')[1].split('=')[1]
            that.idCard = idCard;
            // 获取首页地址
            $.ajax({
                url: "${URL_SCREENING_GETBREADLINE}",
                dataType: 'json',
                type: 'post',
                success: function (data) {
                    var urlLib = JSON.parse(data.data)
                    that.refreshto = urlLib[urlLib.length - 1].href
                }
            })
            // 数据回显
            $.ajax({
                url: "${URL_BLOOTFAT_PATIENTBLOODFAT}",
                data: {
                    idCard: that.idCard
                },
                dataType: 'json',
                type: 'get',
                success: function (data) {
                    console.log(data)
                    if (data.data) {
                        that.bfData = data.data;
                        that.bfData.diagTriglyceride = data.data.diagTriglyceride;
                        that.bfData.diagCholesterol = data.data.diagCholesterol;
                        that.bfData.diagLowCholesterol = data.data.diagLowCholesterol;
                        that.bfData.diagHighCholesterol = data.data.diagHighCholesterol;
                        if (that.bfData.diagnosisTime != null) {
                            that.bfData.diagnosisTime = that.bfData.diagnosisTime.slice(0, 10);
                        }
                        that.total = parseInt(that.bfData.meat) + parseInt(that.bfData.cream) + parseInt(that.bfData.fried) + parseInt(that.bfData.eggs) + parseInt(that.bfData.meatType);
                        if (isNaN(parseInt(that.total))) {
                            that.total = 0
                        }
                        var symptomList = that.$refs.symptom.children;
                        that.noDataShow(that.isArr(data.data.symptom), symptomList);
                        var familyHistoryList = that.$refs.familyHistory.children;
                        that.noDataShow(that.isArr(data.data.familyHistory), familyHistoryList);
                        var complicationSituationList = that.$refs.complicationSituation.children;
                        that.noDataShow(that.isArr(data.data.complicationSituation), complicationSituationList);
                        var complicationList = that.$refs.complication.children;
                        that.noDataShow(that.isArr(data.data.complication), complicationList);
                        var selfCareList = that.$refs.selfCare.children;
                        that.noDataShow(that.isArr(data.data.selfCare), selfCareList);
                        var foodList = that.$refs.food.children;
                        that.noDataShow(that.isArr(data.data.food), foodList);
                        var smokeList = that.$refs.smoke.children;
                        that.noDataShow(that.isArr(data.data.smoke), smokeList);
                        var drinkList = that.$refs.drink.children;
                        that.noDataShow(that.isArr(data.data.drink), drinkList);
                        var sportsList = that.$refs.sports.children;
                        that.noDataShow(that.isArr(data.data.sports), sportsList);
                        var meatList = that.$refs.meat.children;
                        that.noDataShow(that.isArr(data.data.meat), meatList);
                        var meatTypeList = that.$refs.meatType.children;
                        that.noDataShow(that.isArr(data.data.meatType), meatTypeList);
                        var eggsList = that.$refs.eggs.children;
                        that.noDataShow(that.isArr(data.data.eggs), eggsList);
                        var friedList = that.$refs.fried.children;
                        that.noDataShow(that.isArr(data.data.fried), friedList);
                        var creamList = that.$refs.cream.children;
                        that.noDataShow(that.isArr(data.data.cream), creamList);
                    }
                }
            })
            // 获取上一次填写的数据
            $.ajax({
                url: "${URL_PPPATIENTBASE_PATIENTDATA}",
                type: 'get',
                dataType: "json",
                data: {
                    idCard: that.idCard
                },
                success: function (data) {
                    if (data.data != null) {
                        that.bfData.bmi = data.data.bmi;
                        that.bfData.bloodFat = data.data.bloodFat;
                        that.bfData.highCholesterol = data.data.highCholesterol;
                        that.bfData.lowCholesterol = data.data.lowCholesterol;
                        that.bfData.cholesterol = data.data.cholesterol;
                        that.bfData.triglyceride = data.data.triglyceride;
                        if (data.data.bloodSugar) {
                            that.bfData.bloodSugar = data.data.bloodSugar;
                        }
                        that.bfData.lowPressure = data.data.lowPressure;
                        that.bfData.highPressure = data.data.highPressure;
                        that.bfData.heartRate = data.data.heartRate;
                        that.bfData.waist = data.data.waist;
                        that.bfData.weight = data.data.weight;
                        that.bfData.height = data.data.height;
                    }
                }
            })
        },
        methods: {
            keep() {
                let that = this;
                // 获取主要症状数据
                var symptomList = this.$refs.symptom.children;
                var symptom = that.arrToString(symptomList);
                // 获取家族史
                var familyHistoryList = this.$refs.familyHistory.children;
                var familyHistory = that.arrToString(familyHistoryList);
                // 获取并发症发生情况
                var complicationList = this.$refs.complication.children;
                var complication = that.arrToString(complicationList);
                // 获取并发症情况
                var complicationSituationList = this.$refs.complicationSituation.children;
                var complicationSituation = that.arrToString(complicationSituationList);
                // 获取自理能力
                var selfCareList = this.$refs.selfCare.children;
                var selfCare = that.arrToString(selfCareList);
                // 获取饮食
                var foodList = this.$refs.food.children;
                var food = that.arrToString(foodList);
                // 获取吸烟情况
                var smokeList = this.$refs.smoke.children;
                var smoke = that.arrToString(smokeList);
                // 获取饮酒情况
                var drinkList = this.$refs.drink.children;
                var drink = that.arrToString(drinkList);
                // 获取体育锻炼
                var sportsList = this.$refs.sports.children;
                var sports = that.arrToString(sportsList);
                // 一周吃肉小于75g
                var meatList = this.$refs.meat.children;
                var meat = that.arrToString(meatList);
                // 肉的种类
                var meatTypeList = this.$refs.meatType.children;
                var meatType = that.arrToString(meatTypeList);
                // 吃蛋数量
                var eggsList = this.$refs.eggs.children;
                var eggs = that.arrToString(eggsList);
                // 油炸食品数量
                var friedList = this.$refs.fried.children;
                var fried = that.arrToString(friedList);
                // 奶油蛋糕数量
                var creamList = this.$refs.cream.children;
                var cream = that.arrToString(creamList);
                that.total = parseInt(meat) + parseInt(cream) + parseInt(fried) + parseInt(eggs) + parseInt(meatType);
                if (isNaN(parseInt(that.total))) {
                    that.total = 0
                }
                $.ajax({
                    url: '${URL_BLOOTFAT_PATIENTBLOODFATSAVE}',
                    data: {
                        idCard: that.idCard,
                        bfGrade: that.bfData.bfGrade,
                        diagnosisTime: $('#beginTime').val(),
                        symptom: symptom,
                        otherSymptom: that.bfData.otherSymptom,
                        familyHistory: familyHistory,
                        complication: complication,
                        otherComplication: that.bfData.otherComplication,
                        selfCare: selfCare,
                        complicationSituation: complicationSituation,
                        medicalMsg: that.bfData.medicalMsg,
                        food: food,
                        smoke: smoke,
                        drink: drink,
                        sports: sports,
                        height: that.bfData.height,
                        weight: that.bfData.weight,
                        bmi: that.bfData.bmi,
                        waistline: that.bfData.waistline,
                        pul: that.bfData.pul,
                        bloodSugar: that.bfData.bloodSugar,
                        highPressure: that.bfData.highPressure,
                        lowPressure: that.bfData.lowPressure,
                        triglyceride: that.bfData.triglyceride,
                        cholesterol: that.bfData.cholesterol,
                        highCholesterol: that.bfData.highCholesterol,
                        lowCholesterol: that.bfData.lowCholesterol,
                        otherIll: that.bfData.otherIll,
                        bloodFat: that.bfData.bloodFat,
                        proposal: that.bfData.proposal,
                        meat: meat,
                        meatType: meatType,
                        eggs: eggs,
                        fried: fried,
                        cream: cream,
                        total: that.bfData.total,
                        diagTriglyceride: that.bfData.diagTriglyceride,
                        diagCholesterol: that.bfData.diagCholesterol,
                        diagLowCholesterol: that.bfData.diagLowCholesterol,
                        diagHighCholesterol: that.bfData.diagHighCholesterol
                    },
                    dataType: 'json',
                    type: 'post',
                    success: function (data) {
                        if (data.success) {
                            // 刷新当前页面
                            parent.showSrc(that.refreshto);
                            window.parent.simpleCloseModal();
                        } else if (!data.success) {
                            alert(data.msg)
                        }
                    }
                })
            },
            // 判断当前数据是否可以转化为数组 用 , 截取
            isArr(data) {
                var str = '';
                var arr = [];
                if (data != null) {
                    if (typeof data == 'string') {
                        arr = data.split(',');
                        return arr
                    } else {
                        str = data;
                        return str
                    }
                } else {
                    return ''
                }
            },
            // 不在data中的数据匹配
            noDataShow(arr, child) {
                // 若为数组 则循环遍历渲染
                if (arr instanceof Array) {
                    for (var a = 0; a < child.length; a++) {
                        for (var i = 0; i < arr.length; i++) {
                            if (child[a].firstChild.getAttribute('value') == arr[i]) {
                                child[a].firstChild.checked = true
                            }
                        }
                    }
                } else {
                    [...child].forEach((item, index) => {
                        if (item.firstChild.getAttribute('value') == arr) {
                            item.firstChild.checked = true
                        }
                    })
                }
            },
            // 匹配获取新的数组
            getNewArr(data) {
                let that = this;
                var arr = [];
                that.illnessData.forEach((item, index) => {
                    if (item.id == data) {
                        arr = item.list
                    }
                })
                return arr
            },
            // 公用返回一个字符串集合
            arrToString(array) {
                var arr = [];
                [...array].forEach((item, index) => {
                    if (item.firstChild.checked) {
                        arr.push(item.firstChild.getAttribute('value'))
                    }
                })
                return arr.toString()
            }
        }
    })

    //关闭并刷新
    function closeFrame() {
        window.parent.simpleCloseModal();
    }

    // boot时间选择器插件
    $(document).ready(function () {
        initLayDate('#beginTime');
    });

    function initLayDate(id) {
        laydate({
            elem: id,
            istime: true,
            format: 'YYYY-MM-DD',
            choose: function (dates) { //选择好日期的回调
//                initLineTable();
            }
        })
    }
</script>
</body>
</html>
